<script setup lang="ts">
import { ref } from 'vue'
import { useRoute } from 'vue-router'
import { message } from 'ant-design-vue'
import * as userApi from '@/api/user'

const route = useRoute()

// 提醒设置
let txCheckedList = ref<Array<string>>([])
const txOptions = [
  { label: '平台登录异常提醒', value: '1' },
  { label: '出票失败提醒', value: '2' },
  { label: '出票成功提醒', value: '3' },
  // { label: '每日业务总结', value: '4' },
  { label: '闲鱼无意图消息提醒', value: '5' },
  { label: '微信无意图消息提醒', value: '6' },
  { label: '创建订单失败提醒', value: '7' },
]
const txChange = (e: any) => {
  console.log('提醒=', txCheckedList.value)
}

// 提醒渠道
let txqdValueList = ref<Array<string>>([])
const txqdOptions = [
  { label: '企微机器人', value: '1' },
  { label: '钉钉机器人', value: '2' },
]

let ddKey = ref<string>('')
let qwKey = ref<string>('')
let balanceErrorAmount = ref<any>('')
let balanceErrorRemind = ref<boolean>(false)

const formRef = ref()
let labelCol = { span: 5 }
interface FormState {
  appkey: string
  appSerect: string
}
const formState = reactive<FormState>({
  appkey: '',
  appSerect: '',
})
import type { Rule } from 'ant-design-vue/es/form'
const rules: Record<string, Rule[]> = {
  appkey: [{ required: true, message: '良票appkey', trigger: 'blur' }],
  appSerect: [{ required: true, message: '良票appSerect', trigger: 'blur' }],
}

const saveSystem = async () => {
  const params = {
    loginErrorRemind: 0,
    outTicketErrorRemind: 0,
    outTicketSucceedRemind: 0,
    fishNullifyMessageRemind: 0,
    wechatNullifyMessageRemind: 0,
    wecomRobotOnOff: 0,
    dingTalkRobotOnOff: 0,
    orderErrorRemind: 0,
    balanceErrorAmount: balanceErrorAmount.value * 100,
    // orderErrorRemind: orderErrorRemind.value ? 1 : 0,
    balanceErrorRemind: balanceErrorRemind.value ? 1 : 0,
    // platformKey: '',
    // platformSecret: '',
  }
  txCheckedList.value.forEach(item => {
    // 平台登录异常提醒
    if (item == '1') {
      params.loginErrorRemind = 1
    }
    // 出票失败提醒
    if (item == '2') {
      params.outTicketErrorRemind = 1
    }
    if (item == '7') {
      params.orderErrorRemind = 1

    }
    // 出票成功提醒
    if (item == '3') {
      params.outTicketSucceedRemind = 1
    }
    // 闲鱼无意图消息提醒
    if (item == '5') {
      params.fishNullifyMessageRemind = 1
    }
    // 微信无意图消息提醒
    if (item == '6') {
      params.wechatNullifyMessageRemind = 1
    }
  })
  txqdValueList.value.forEach(item => {
    // 企微机器人
    if (item == '1') {
      params.wecomRobotOnOff = 1
      params.wecomRobotKey = qwKey.value
    }
    // 钉钉机器人
    if (item == '2') {
      params.dingTalkRobotOnOff = 1
      params.dingTalkRobotKey = ddKey.value
    }
  })

  formRef.value.validate().then(async () => {
    // console.log('formState=', formState)
    // params.platformKey = formState.appkey
    // params.platformSecret = formState.appSerect
    try {
      const res = await userApi.settingUserSystem(params)
      if (res.state == 200) {
        message.success('保存成功')
      } else {
        message.error(res.message)
      }
    } catch (error) {
      message.error('网络请求连接失败~')
    }
  })
}

const getSystem = async () => {
  try {
    let { state, data, message: msg } = await userApi.getUserSetting()
    if (state === 200) {
      formState.appkey = data.platformKey
      formState.appSerect = data.platformSecret
      balanceErrorRemind.value = data.balanceErrorRemind ? true : false
      balanceErrorAmount.value = data.balanceErrorAmount ? data.balanceErrorAmount / 100 : 0
      // orderErrorRemind.value = data.orderErrorRemind ? true : false

      // 平台登录异常提醒
      if (data.loginErrorRemind == 1) {
        txCheckedList.value.push('1')
      }
      // 出票失败提醒
      if (data.outTicketErrorRemind == 1) {
        txCheckedList.value.push('2')
      }
      // 出票成功提醒
      if (data.outTicketSucceedRemind == 1) {
        txCheckedList.value.push('3')
      }
      // 闲鱼无意图消息提醒
      if (data.fishNullifyMessageRemind == 1) {
        txCheckedList.value.push('5')
      }
      // 微信无意图消息提醒
      if (data.wechatNullifyMessageRemind == 1) {
        txCheckedList.value.push('6')
      }
      //创建订单失败提醒
      if (data.orderErrorRemind) {
        txCheckedList.value.push('7')

      }

      // 企微机器人
      if (data.wecomRobotOnOff == 1) {
        txqdValueList.value.push('1')
      }
      qwKey.value = data.wecomRobotKey
      // 钉钉机器人
      if (data.dingTalkRobotOnOff == 1) {
        txqdValueList.value.push('2')
      }
      ddKey.value = data.dingTalkRobotKey
    } else {
      message.error(msg)
    }
  } catch (error) {
    message.error('网络请求连接失败~')
  }
}

onMounted(() => getSystem())
</script>

<template>
  <page-container :title="route.meta.title">
    <a-card style="overflow-x: scroll">
      <div class="rowBox">
        <span class="label-1">提醒设置：</span>
        <a-checkbox-group v-model:value="txCheckedList" :options="txOptions" @change="txChange" />
      </div>

      <div class="rowBox">
        <span class="label-1">提醒渠道：</span>
        <!-- <a-checkbox-group v-model:value="txqdValueList" :options="txqdOptions" @change="txqdChange" /> -->
        <a-checkbox-group v-model:value="txqdValueList">
          <a-checkbox v-for="(item, index) in txqdOptions" :key="index" :value="item.value">
            <span>{{ item.label }}</span>
          </a-checkbox>
        </a-checkbox-group>
      </div>

      <div class="rowBox" v-if="txqdValueList.includes('1')">
        <span class="label-1"></span>
        <span>企微机器人key：</span>
        <a-input v-model:value="qwKey" style="width: 400px"></a-input>
      </div>

      <div class="rowBox" v-if="txqdValueList.includes('2')">
        <span class="label-1"></span>
        <span>钉钉机器人key：</span>
        <a-input v-model:value="ddKey" style="width: 400px"></a-input>
      </div>
      <div class="rowBox1">
        <span class="label-1">余额阈值提醒：</span>
        <a-switch v-model:checked="balanceErrorRemind" />
      </div>
      <div class="rowBox1" v-if="balanceErrorRemind">
        <span class="label-1">预警金额：</span>
        <a-input v-model:value="balanceErrorAmount" type="number" style="width: 120px;"
        suffix="元"></a-input>
      </div>

      <!-- <div class="rowBox1">
        <span class="label-1">创建订单失败提醒:</span>
        <a-switch v-model:checked="orderErrorRemind" />
      </div> -->


      <a-form ref="formRef" :rules="rules" :model="formState" :label-col="labelCol" style="width: 540px">
        <!-- <a-form-item label="良票appkey" name="appkey">
          <a-input v-model:value="formState.appkey" style="width: 400px" />
        </a-form-item>

        <a-form-item label="良票appSerect" name="appSerect">
          <a-input v-model:value="formState.appSerect" style="width: 400px" />
        </a-form-item> -->

        <a-button type="primary" style="border-radius: 6px" @click="saveSystem">保存</a-button>
      </a-form>
    </a-card>
  </page-container>
</template>

<style lang="less" scoped>
.hiddenText {
  display: inline-block;
  width: 1000px;
  overflow: hidden;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

a:hover {
  color: red;
}

.rowBox {
  display: flex;
  margin-bottom: 15px;
  // background: pink;
}

.rowBox1 {
  margin-bottom: 15px;
  display: flex;
  align-items: center;


}

.label-1 {
  width: 140px;
  text-align: right;
  line-height: 30px;
  padding-right: 5px;
}

.iptWidth {
  width: 500px;
}
</style>
